<template>
    <div class="menuManagement">
        <navigation-bar>
            <div class="searchContent">
                <div class="other">
                    <!-- <custom-button type="custom" icon="el-icon-takeaway-box" @customClick="exportXls" title="保存"></custom-button> -->
                    &nbsp;
                </div>
            </div>
        </navigation-bar>

        <el-table height="calc(100vh - 160px)" :data="tableData" style="width: 100%; margin: 10px 0" row-key="id" border default-expand-all>
            <el-table-column prop="xxType" label="消息类型" width="400">
                <template slot-scope="scope">
                    <div style="display: flex">
                        <label style="margin-right: 10px; min-width: 140px; text-align: right">
                            {{ scope.row.xxType }}
                        </label>
                        <span style="color: #999" v-html="getContent(scope.row.xxContent)"> </span>
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="info" label="消息发送方式" width="600">
                <template slot-scope="scope">
                    <el-checkbox disabled v-model="scope.row.webType">Web系统消息</el-checkbox>
                    <el-checkbox disabled v-model="scope.row.appType">App系统消息</el-checkbox>
                    <el-checkbox disabled v-model="scope.row.emailType">邮件通知</el-checkbox>
                    <el-checkbox disabled v-model="scope.row.telType">手机短信通知</el-checkbox>
                </template>
            </el-table-column>
            <el-table-column prop="jqSend" label="假期是否发送">
                <template slot-scope="scope">
                    <el-checkbox disabled v-model="scope.row.jqSend"></el-checkbox>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
import navigationBar from '@/components/customComponents/managementCenter/navigationBar'
// import customButton from "@/components/customComponents/customForm/customButton"
// import {Utility} from "@/libs/utility"
import {warnHistoryList} from '@/mockData/systemManage.js'
export default {
    name: 'menuManagement',
    components: {navigationBar},
    data() {
        return {
            tableData: warnHistoryList
        }
    },
    computed: {},
    created() {},
    methods: {
        getContent(content) {
            var splitC = content.split(',')
            var html = ''
            splitC.forEach((t) => {
                html += `${t}<br/>`
            })
            return html
        }
    }
}
</script>

<style lang="scss" scoped>
.menuManagement {
    .other {
        float: right;
        display: inline-block;
    }
    .btnList {
        text-align: center;
        display: inline-block;
        margin-right: 10px;
        margin-top: 1px;
        float: right;
        .hover {
            border-color: #2680fa !important;
        }
        .btnItem {
            display: inline-block;
            height: 26px;
            width: 60px;
            margin-left: 10px;
            line-height: 26px;
            text-align: left;
            border: 1px solid #e0e0e0;
            border-radius: 4px;
            cursor: pointer;
            &:hover {
                border-color: #2680fa;
            }
            &:first-child {
                margin-left: 0 !important;
            }
            svg {
                margin-top: 2px;
                float: left;
                margin-left: 8px;
                margin-right: 3px;
            }
            label {
                font-size: 14px;
            }
        }
    }
}
</style>
